<template>
  <div class="viewtest whitebg" >
    <ul class="view-box">
      <router-link tag="li" to="/home" class="head-l">
        关闭
      </router-link>
      <router-link tag="li" to="" class="head-c">
        肺部测试
      </router-link>
      <router-link tag="li" to="" class="head-r">
        分享
      </router-link>
    </ul>
    <div class="box">
      <div class="box-answer">
        <span>1/2</span><br>
        <p>你一天吸烟的频率？</p><br>
        <div v-for="(item,index) in test_timu" :key="index" class="box-timu">
          {{ item.name }}
        </div>
        <router-link tag="button" to="/testfinish" type="button" @click="xuanZhong">提交</router-link>
      </div>
    </div>
  </div>
</template>

<script>
  export default {
    name: "ViewTest",
    data(){
      return{
        picked: '',
        test_timu: [
          {
            'type': 1,
            'name': '很少',
            '':''
          },
          {
            'type': 2,
            'name': '较多',
            'danger': '高度危险！您目前属于高危阶段，需要引起重视，建议在医生指导下定期复查或体检。在体检时建议加做胸部低剂量螺旋CT。做到有效预防，定期筛查。'
          },
          {
            'type': 3,
            'name': '经常',
          },
          {
            'type': 4,
            'name': '从不',
            'health': '那你的身体应该很健康了，继续保持'
          },
        ]
      }
    },
    methods:{
      xuanZhong(){

      }
    }
    
  }
</script>

<style scoped>

.view-box{
  width: 100%;
  height: 0.9rem;
  background-color: #44bf91;
}
li{
  float: left;
  text-align: center;
  line-height: 0.9rem;
  color: #f1f1f1;
  font-weight: normal;
}
.head-l{
  width: 20%;
}
.head-c{
  width: 60%;
}
.head-r{
  width: 20%;
}
.box{
  width: 100%;
}
.box-answer{
  position: fixed;
  width:80%;
  margin: 1rem 10%;
}
.box-answer span{
  font-size: 0.3rem;
}
.box-answer p{
  display: block;
  font-size: 0.28rem;
  text-align: left;
  margin-top: 0.2rem;
  margin-bottom: 0.5rem;

}
.box-answer .box-timu{
  text-align: center;
  border: 1px solid #c3c3c3;
  padding: 0.25rem 2.5rem;
  margin-bottom: 0.2rem;
  border-radius: 0.5rem;
}
.box-answer button{
  width: 6rem;
  height: 0.9rem;
  border: none;
  margin-top: 1rem;
  border-radius: 0.15rem;
  background-color: #43bf92;
  font-size: 0.36rem;
}
</style>